@layer components {
  .ngm-background-animate {
    background-size: 400%;

    -webkit-animation: ngm-background-animation 3s ease infinite;
    -moz-animation: ngm-background-animation 3s ease infinite;
    animation: ngm-background-animation 3s ease infinite;
  }

  @keyframes ngm-background-animation {
    0%,
    100% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
  }
}

@keyframes twinkling {
  50% {
    opacity: 0;
    transform: scale(.9);
  }
}

@layer components {
  markdown.ngm-copilot-markdown .thinking-placeholder {
    @apply inline-block w-5 h-5 -mb-1 rounded-full bg-black dark:bg-white;
    animation: twinkling 2000ms infinite linear;
  }
}